<template>
	<view>
		<u-form :model="form" ref="uForm" label-width='150' class="operation" :error-type="['message']" :label-style="labelStyle">
			<!-- 单号 -->
			<u-form-item label="单号" prop='numbers' required>
				<u-input :border="true" v-model="form.numbers" placeholder="" :trim="true" @blur="check" />
				<u-button @click="scan">扫描</u-button>
			</u-form-item>

			<!-- 计算重量 -->
			<u-form-item label="计算重量">
				<u-row gutter="5">
					<u-col span="12">
						<u-number-box v-model="form.length" :min="0" @change="calculate" :input-width="150" /> 长(cm) *
					</u-col>
					<u-col span="12">
						<u-number-box v-model="form.width" :min="0" @change="calculate" :input-width="150" /> 宽(cm) *
					</u-col>
					<u-col span="12">
						<u-number-box v-model="form.height" :min="0" @change="calculate" :input-width="150" /> 高(cm) / {{$volume}}
					</u-col>
				</u-row>
			</u-form-item>
			<u-form-item label="重量" prop='weight'>
				<u-input :border="true" v-model="form.weight" type='number' placeholder='' />
			</u-form-item>
			<u-form-item label="运费" prop='freight'>
				<u-input :border="true" v-model="form.freight" type='number' placeholder='' />
			</u-form-item>

			<u-form-item label="品名" prop='articleName'>
				<u-input :border="true" v-model="form.articleName" placeholder="中文" />
			</u-form-item>
			<u-form-item label="品名" prop='laosArticleName'>
				<u-input :border="true" v-model="form.laosArticleName" placeholder="老挝" />
			</u-form-item>
			<u-form-item label="收件人姓名" prop='receiverName'>
				<u-input :border="true" v-model="form.receiverName" placeholder="中文" />
			</u-form-item>
			<u-form-item label="收件人姓名" prop='laosReceiverName'>
				<u-input :border="true" v-model="form.laosReceiverName" placeholder="老挝" />
			</u-form-item>
			<u-form-item label="收件人地址" prop='receiverAddress'>
				<u-input :border="true" v-model="form.receiverAddress" placeholder="中文" />
			</u-form-item>
			<u-form-item label="收件人地址" prop='laosReceiverAddress'>
				<u-input :border="true" v-model="form.laosReceiverAddress" placeholder="老挝" />
			</u-form-item>
			<u-form-item label="收件人联系电话" prop='receiverPhone'>
				<u-input :border="true" v-model="form.receiverPhone" />
			</u-form-item>
			<u-form-item label="发往网点" prop='sendToUserId'>
				<u-input :border="true" v-model="form.sendToName" @click="sendShow = true" type="select" placeholder="" />
				<u-picker @confirm="selectSend" mode="selector" v-model="sendShow" title="发往网点" :mask-close-able="true" :range="sendSite"
				 range-key="name"></u-picker>
			</u-form-item>
			<u-form-item label="修改原因" prop='reason' required>
				<u-input :border="true" v-model="form.reason" placeholder="中文" />
			</u-form-item>
		</u-form>

		<!-- 提交 -->
		<view class="submitBtn">
			<u-button @click='submit' type="warning" throttleTime="500" hoverStayTime="100" :custom-style="submitBtnStyle" shape="circle"
			 :ripple="true">添加</u-button>
		</view>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import {
		isEmpty,
		resetForm
	} from '@/utils/common.js'

	export default {
		data() {
			return {
				isPass: false,
				state: 4, // 0揽收 1发出 2到达 3待取件 4问题件 5签收
				form: {
					numbers: '', // 单号
					length: 0,
					width: 0,
					height: 0, // 计算
					weight: '', // 重量
					freight: '', // 运费
					articleName: '',
					laosArticleName: '', // 品名
					receiverName: '',
					laosReceiverName: '', // 收件人姓名
					receiverAddress: '',
					laosReceiverAddress: '', // 收件人地址
					receiverPhone: '', // 收件人联系电话
					sendToUserId: null,
					sendToUserName: '',
					sendToName: '',
					laosSendToName: '', // 发往网点
					reason: '' // 修改原因
				},
				rules: {
					numbers: {
						required: true,
						message: '请输入单号',
						trigger: 'blur'
					},
					reason: {
						required: true,
						message: '修改原因',
						trigger: 'blur'
					}
				},
				sendShow: false,
				sendSite: [],
				submitBtnStyle: {
					width: '690rpx',
					color: '#FFFFFF',
					height: '80rpx',
					lineHeight: '80rpx',
					overflow: 'hidden',
					letterSpacing: '2rpx',
					fontSize: '34rpx',
					fontWeight: '500',
					backgroundImage: 'linear-gradient(to right, #F7B314, #F5D547)',
					boxShadow: '0 3px 6px 0 rgba(247,179,50,0.33)'
				},
				labelStyle: {
					color: '#666',
					fontSize: '28rpx',
					lineHeight: 1,
					fontWeight: 500
				}
			}
		},
		computed: {
			site() {
				return this.$store.getters.site
			}
		},
		mounted() {
			this.getAllSite()
			this.$refs.uForm.setRules(this.rules);
		},
		methods: {
			setCurrent() {
				this.form.currentUserId = this.site.id;
				this.form.currentUserName = this.site.username;
				this.form.currentName = this.site.name;
				this.form.laosCurrentName = this.site.laosName;
			},

			// 扫描获取单号
			scan() {
				let _this = this
				uni.scanCode({
					scanType: ['barCode'],
					success: function(res) {
						_this.form.numbers = res.result
						_this.check()
					}
				})
			},

			// 检测单号
			check() {
				if (!this.form.numbers) return
				let param = {
					state: this.state,
					numbers: this.form.numbers
				};
				this.isPass = false
				uni.showLoading()
				this.$api.checkApi(param).then(result => {
					uni.hideLoading()
					let reponse = result.resultParam
					if (reponse.successList.length === 1) {
						this.isPass = true
					} else {
						this.isPass = false
						this.sendErrorMsg(reponse.errorMap)
					}
				}).catch(() => {
					uni.hideLoading()
				})
			},

			// 发送错误信息
			sendErrorMsg(error) {
				for (let key in error) {
					if (error[key].length === 1) {
						let keyName = '';
						if (key === 'numberNotArrive') keyName = '不能被到达';
						if (key === 'numberNotSender') keyName = '不能被发出';
						if (key === 'numberNotDelivery') keyName = '不能待取件';
						if (key === 'numberNotSign') keyName = '不能被签收';
						if (key === 'numberNotFoundList') keyName = '单号不存在';
						if (key === 'numberNotUse') keyName = '单号未使用';
						if (key === 'problemNotDeal') keyName = '问题件未处理';
						uni.showToast({
							title: keyName,
							icon: 'none'
						})
						break;
					}
				}
			},

			// 获得所有网点
			getAllSite() {
				let data = {
					username: ''
				}
				this.$api.listAllUserApi(data).then(result => {
					this.sendSite = result.resultParam.userList
				})
			},
			// 选择发往网点
			selectSend(index) {
				let obj = this.sendSite[index]
				this.form.sendToUserId = obj.id
				this.form.sendToName = obj.name
				this.form.laosSendToName = obj.laosName
				this.form.sendToUserName = obj.username
			},

			// 提交
			submit() {
				let _this = this
				this.setCurrent()
				if (!this.isPass) {
					this.$refs.uToast.show({
						title: '无法提交，单号未通过检测'
					})
					return
				}
				this.$refs['uForm'].validate(valid => {
					if (!valid) {
						this.$refs.uToast.show({
							title: '无法提交，有必填项未填写'
						})
						return;
					}
					uni.showModal({
						title: '确认提交？',
						content: '',
						success: function(res) {
							if (res.confirm) {
								let data = {
									..._this.form
								}
								delete data.length;
								delete data.width;
								delete data.height;
								for (let key in data) {
									if (!data[key]) delete data[key]
								}
								if (Object.keys(data).length === 2) {
									_this.$refs.uToast.show({
										title: '没有修改任何东西，无法提交！'
									})
									return
								}
								if (data.weight) data.weight = _this.form.weight / 1;
								if (data.freight) data.freight = _this.form.weight / 1;
								uni.showLoading();
								_this.$api.addCourierEditExpressOrderApi(data).then(result => {
									uni.hideLoading();
									if (result.status !== 200) return;
									uni.showToast({
										title: '添加成功'
									})
									_this.cancel()
								}).catch(() => {
									uni.hideLoading();
								});
							}
						}
					})
				})
			},

			// 计算体积重量
			calculate() {
				let length = this.form.length;
				let width = this.form.width;
				let height = this.form.height;
				this.form.weight = length * width * height / this.$volume
				let weight_1 = this.form.weight.toFixed(1)
				let weight_0 = this.form.weight.toFixed(0)
				if (weight_1 / 1 === weight_0 / 1) {
					this.form.weight = weight_0
				} else {
					this.form.weight = weight_1
				}
				if (isNaN(this.form.weight)) this.form.weight = ''
			},

			// 关闭
			cancel() {
				resetForm(this)
			}
		}
	}
</script>

<style lang="scss">
	.operation {
		padding-left: 16rpx;
		padding-right: 8rpx;
		background-color: #FFFFFF;
		border-top: rgb(230, 230, 230) solid 2rpx;
	}

	.submitBtn {
		height: 110rpx;
		flex-direction: column;
		z-index: 101;
		background: #FFFFFF;
		padding: 10px;
		display: flex;
		justify-content: center;
		align-items: center;
	}
</style>
